//提供一个构造函数
function LFRect(option) {
    //初始化操作
    this._init(option)
}
//设置原型对象
LFRect.prototype = {
    //修正构造器属性
    constructor:LFRect,
    _init:function (option) {
        option = option || {};
        this.x = option.x == 0 ? 0:option.x || 100;
        this.y = option.y == 0 ? 0:option.y || 100;
        this.width = option.width == 0 ? 0:option.width || 100;
        this.height = option.height == 0 ? 0:option.height || 100;

        //描边：
        this.strokeColor = option.strokeColor || "red";
        this.strokeWidth = option.strokeWidth || 10;

        //填充：
        this.fillColor = option.fillColor || 'purple';

        //位移：
        this.translateX = option.translateX || 0;
        this.translateY = option.translateY || 0;
        //放大
        this.scaleX = option.scaleX || 0;
        this.scaleY = option.scaleY || 0;
        //放大角度
        this.angle = option.angle || 0;
    },
    renderStroke:function (ctx) {
        ctx.save();
        ctx.beginPath();
        ctx.translate(this.translateX,this.translateY);
        ctx.scale(this.scaleX,this.scaleY);
        ctx.rotate(this.angle*Math.PI/180);
        ctx.strokeStyle = this.strokeColor;
        ctx.lineWidth = this.strokeWidth;
        ctx.strokeRect(this.x,this.y,this.width,this.height);
        ctx.stroke();
        ctx.restore();
    },
    renderFill:function (ctx) {
        ctx.save();
        ctx.beginPath();
        ctx.translate(this.translateX,this.translateY);
        ctx.scale(this.scaleX,this.scaleY);
        ctx.rotate(this.angle*Math.PI/180);
        ctx.fillStyle = this.fillColor;
        ctx.fillRect(this.x,this.y,this.width,this.height);
        ctx.fill();
        ctx.restore();
    }
};